v2.2.6

Compare Source

Patch Changes

• #​7071 a8e7301 Thanks @​ptkagori! - Added the useQwikMethodUsage lint rule for the Qwik domain.

  This rule validates Qwik hook usage. Identifiers matching useXxx must be called only within serialisable reactive contexts (for example, inside component$, route loaders/actions, or within other Qwik hooks), preventing common Qwik antipatterns.

  Invalid:

  // Top-level hook call is invalid.
  const state = useStore({ count: 0 });
  
  function helper() {
    // Calling a hook in a non-reactive function is invalid.
    const loc = useLocation();
  }

  Valid:

  component$(() => {
    const state = useStore({ count: 0 }); // OK inside component$.
    return <div>{state.count}</div>;
  });
  
  const handler = $(() => {
    const loc = useLocation(); // OK inside a $-wrapped closure.
    console.log(loc.params);
  });

• #​7685 52071f5 Thanks @​denbezrukov! - Fixed #​6981: The NoUnknownPseudoClass rule no longer reports local pseudo-classes when CSS Modules are used.

• #​7640 899f7b2 Thanks @​arendjr! - Fixed #​7638: useImportExtensions no longer emits diagnostics on valid import paths that end with a query or hash.

Example

// This no longer warns if `index.css` exists:
import style from "../theme/index.css?inline";

• #​7071 a8e7301 Thanks @​ptkagori! - Added the useQwikValidLexicalScope rule to the Qwik domain.

  This rule helps you avoid common bugs in Qwik components by checking that your variables and functions are declared in the correct place.

  Invalid:

  // Invalid: state defined outside the component's lexical scope.
  let state = useStore({ count: 0 });
  const Component = component$(() => {
    return (
      <button onClick$={() => state.count++}>Invalid: {state.count}</button>
    );
  });

  Valid:

  // Valid: state initialised within the component's lexical scope and captured by the event.
  const Component = component$(() => {
    const state = useStore({ count: 0 });
    return <button onClick$={() => state.count++}>Valid: {state.count}</button>;
  });

• #​7620 5beb1ee Thanks @​Netail! - Added the rule useDeprecatedDate, which makes a deprecation date required for the graphql @deprecated directive.

  Invalid

  query {
    member @​deprecated(reason: "Use `members` instead") {
      id
    }
  }

  Valid

  query {
    member
      @​deprecated(reason: "Use `members` instead", deletionDate: "2099-12-25") {
      id
    }
  }

• #​7709 d6da4d5 Thanks @​siketyan! - Fixed #​7704: The useExhaustiveDependencies rule now correctly adds an object dependency when its method is called within the closure.

  For example:

  function Component(props) {
    useEffect(() => {
      props.foo();
    }, []);
  }

  will now be fixed to:

  function Component(props) {
    useEffect(() => {
      props.foo();
    }, [props]);
  }

• #​7624 309ae41 Thanks @​lucasweng! - Fixed #​7595: noUselessEscapeInString no longer reports $\{ escape in template literals.

• #​7665 29e4229 Thanks @​ryan-m-walker! - Fixed #​7619: Added support for parsing the CSS :state() pseudo-class.

  custom-selector:state(checked) {
  }

• #​7608 41df59b Thanks @​ritoban23! - Fixed #​7604: the useMaxParams rule now highlights parameter lists instead of entire function bodies. This provides more precise error highlighting. Previously, the entire function was highlighted; now only the parameter list is highlighted, such as (a, b, c, d, e, f, g, h).

• #​7643 459a6ac Thanks @​daivinhtran! - Fixed #​7580: Include plugin in summary report

v3.3.0: DOMPurify 3.3.0

Compare Source

• Added the SVG mask-type attribute to default allow-list, thanks @​prasadrajandran
• Added support for ADD_ATTR and ADD_TAGS to accept functions, thanks @​nelstrom
• Fixed an issue with the slot element being in both SVG and HTML allow-list, thanks @​Wim-Valgaeren

v0.25.11

Compare Source

• Add support for with { type: 'bytes' } imports (#​4292)

  The import bytes proposal has reached stage 2.7 in the TC39 process, which means that although it isn't quite recommended for implementation, it's generally approved and ready for validation. Furthermore it has already been implemented by Deno and Webpack. So with this release, esbuild will also add support for this. It behaves exactly the same as esbuild's existing binary loader. Here's an example:

  import data from './image.png' with { type: 'bytes' }
  const view = new DataView(data.buffer, 0, 24)
  const width = view.getInt32(16)
  const height = view.getInt32(20)
  console.log('size:', width + '\xD7' + height)

• Lower CSS media query range syntax (#​3748, #​4293)

  With this release, esbuild will now transform CSS media query range syntax into equivalent syntax using min-/max- prefixes for older browsers. For example, the following CSS:

  @&#8203;media (640px <= width <= 960px) {
    main {
      display: flex;
    }
  }

  will be transformed like this with a target such as --target=chrome100 (or more specifically with --supported:media-range=false if desired):

  @​media (min-width: 640px) and (max-width: 960px) {
    main {
      display: flex;
    }
  }

v7.1.10

Compare Source

Bug Fixes

• css: avoid duplicate style for server rendered stylesheet link and client inline style during dev (#​20767) (3a92bc7)
• css: respect emitAssets when cssCodeSplit=false (#​20883) (d3e7eee)
• deps: update all non-major dependencies (879de86)
• deps: update all non-major dependencies (#​20894) (3213f90)
• dev: allow aliases starting with // (#​20760) (b95fa2a)
• dev: remove timestamp query consistently (#​20887) (6537d15)
• esbuild: inject esbuild helpers correctly for esbuild 0.25.9+ (#​20906) (446eb38)
• normalize path before calling fileToBuiltUrl (#​20898) (73b6d24)
• preserve original sourcemap file field when combining sourcemaps (#​20926) (c714776)

Documentation

• correct WebSocket spelling (#​20890) (29e98dc)

Miscellaneous Chores

• deps: update rolldown-related dependencies (#​20923) (a5e3b06)